<html>

<head>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>


<body>
    <p>你出</p>
    <button type="button" id="rock">Rock</button>
    <button type="Button" id="scissors">Scissors</button>
    <button type="Button" id="paper">Paper</button>
    <p>电脑出:
    <label id="computer"></label>
    </p>
    <p>结果是:
    <label id="result"></label>
    </p>
    <script type="text/javascript">
       
     window.onload=function(){
        $("button").click(function() {
            $("button").css("background-color", "transparent");
            $(this).css("background-color", "red");
            var mine = $(this).attr("id");
            console.log(mine);
            var computer_num = Math.floor(Math.random() * 3);
            var computer;
            switch (computer_num) {
            case 0:
                computer = "Rock";
                break;
            case 1:
                computer = "Scissors";
                break;
            case 2:
                computer = "Paper";
                break;
            }
            $("#computer").text(computer);
            var mine_num = {
            "rock": 0,
            "scissors": 1,
            "paper": 2
            }[mine];
            console.log(mine_num);
            var result = [
            ["平手", "你赢了", "你输了"],
            ["你输了", "平手", "你赢了"],
            ["你赢了", "你输了", "平手"],
            ];
            $("#result").text(result[mine_num][computer_num]);
        });
    }
</script>

</body>

</html>